require("../css/personalInfo.less")

window.onload = function () {
    // 获取相关元素
    let back = document.querySelector(".back")
    // 渲染的
    let nicknameText = document.querySelector(".nicknameText")
    let genderText = document.querySelector(".genderText")
    let birthdayText = document.querySelector(".birthdayText")
    let signText = document.querySelector(".signText")
    let provenceText = document.querySelector(".provenceText")
    let cityText = document.querySelector(".cityText")
    let save = document.querySelector(".save")
    // 全局变量
    let userId = localStorage.getItem("userId")
    let pid
    // 修改信息的
    let nickname = document.querySelector(".nickname")
    let gender = document.querySelector(".gender")
    let birthday = document.querySelector("#birthday")
    let sign = document.querySelector(".signText")
    let provence = document.querySelector("#provence")
    let city = document.querySelector("#city")

    // 点击返回按钮,返回上一页
    back.addEventListener("click", function () {
        // history.back()
        location.href = "personalPage.html"
    })
    // 格林威治时间改标准时间函数
    function standard(timer) {
        let date = new Date(timer)
        let y = date.getFullYear();
        let m = date.getMonth() + 1 < 10 ? "0" + (date.getMonth() + 1) : date.getMonth() + 1;
        let d = date.getDate() < 10 ? "0" + date.getDate() : date.getDate();
        let time = `${y}-${m}-${d}`
        return time
    }

    // 打开页面就获取数据
    http.get("/users/accountinfo", {
        userId
    }, function (res) {
        if (res.data.nickname) {
            nicknameText.value = res.data.nickname
        }
        if (res.data.gender) {
            genderText.innerText = res.data.gender
        }
        if (res.data.birthday) {
            birthdayText.innerText = standard(res.data.birthday)
        }
        if (res.data.sign) {
            signText.value = res.data.sign
        }
        if (res.data.address) {
            provenceText.textContent = res.data.address.split(",")[0]
        }
        if (res.data.address) {
            cityText.textContent = res.data.address.split(",")[1]
        }
    })

    // 点击修改,信息修改渲染
    // 修改性别
    gender.onclick = function () {
        weui.picker([{
            label: '男',
            value: '男'
        }, {
            label: '女',
            value: "女"
        }], {

            onConfirm: function (result) {
                genderText.textContent = result[0].value
                localStorage.setItem("gender", result[0].value)
            },
            title: '请选择性别'
        });
    }
    // 修改生日
    birthday.addEventListener("click", function () {
        weui.datePicker({
            start: 1920,
            end: new Date().getFullYear(),

            onConfirm: function (result) {
                let y = result[0].value;
                let m = result[1].value < 10 ? "0" + result[1].value : result[1].value;
                let d = result[2].value < 10 ? "0" + result[2].value : result[2].value;
                birthdayText.innerText = `${y}-${m}-${d}`
                localStorage.setItem("birthday", `${y}-${m}-${d}`)
            },
            title: '请选择出生日期'
        });
    })
    // 选择省份
    provence.onclick = function () {
        http.get("/address/province", {}, function (res) {
            let arr = res.data
            let index = arr.findIndex(function (item, index) {
                return item.name == "中国"
            })
            arr.splice(index, 1)
            // 拿到所有的省份名字 所有省份的编号
            let arr1 = arr.map(function (item) {
                return {
                    label: item.name,
                    value: item.addressId
                }
            })

            weui.picker(arr1, {
                onConfirm: function (result) {
                    // 选择省份的时候,重置城市,如果不是刚选择中的
                    if (result[0].label != provenceText.textContent) {
                        cityText.textContent = "请选择"
                    }
                    //    修改省市
                    provenceText.textContent = result[0].label
                    // 拿到修改的省市的id
                    pid = result[0].value
                },
                title: '请选择省市'
            });


        })

    }
    // 选择城市
    city.addEventListener("click", function () {
        // 获取省市id,找其城市
        let addressId = pid
        // 如果没有选择省份就选城市,就提醒用户先选择省份
        if (!addressId) {
            tool.toast(0,"请先选择省份")
        } else {
            http.get(`/address/city/${addressId}`, {
                addressId
            }, function (res) {
                let arr = res.data
                let arr1 = arr.map(function (item) {
                    return {
                        label: item.name,
                        value: item.addressId
                    }
                })
    
                weui.picker(arr1, {
                    onConfirm: function (result) {
                        console.log(result);
                        cityText.textContent = result[0].label
                    },
                    title: '请选择城市'
                });
            })
        }
        
    })

    // 修改用户签名
    signText.addEventListener("blur", function () {
        signText.textContent = signText.value
    })
    // 保存修改的用户信息
    save.addEventListener("click",function(){
        let data = {
            nickname: nicknameText.value,
            gender: genderText.textContent,
            birthday: birthdayText.textContent,
            address: [provenceText.textContent,cityText.textContent],
            sign: signText.value,
            userId:userId
        }
        http.post("/users/userEdit",data,function(res){
            tool.toast(1,"保存信息成功!")
        })
    })

}